import React, {useState} from 'react'
// useState这个函数的作用是，可以在函数组件中使用state

export default function CountFn() {
  // useState这个函数有两个返回值和一个参数
  // 参数是第一个返回值的默认值
  // 第一个返回值是类似state中的一个变量
  // 第二个返回值是修改数据的函数，类似setState
  const [count, setCount] = useState(0);
  const [food, setFood] = useState('rice');
  return (
    <div>
      <p>我是函数组件，要实现一个计数器的功能</p>
      <button onClick={() => setCount(count + 1)}>
        点击次数：{count}
      </button>
      <hr/>
      <p>我的午饭：{food}</p>
      <button onClick={()=>setFood('hotpot')}>吃火锅！</button>
    </div>
  )
}
